<template>
  <div class="vk-countdown">
    <div class="vk-countdown__item">{{ h }}</div>
    <div>:</div>
    <div class="vk-countdown__item">{{ m }}</div>
    <div>:</div>
    <div class="vk-countdown__item">{{ s }}</div>
  </div>
</template>

<script>
export default {
  name: "VkCountdown",
  props: {
    //初始时间 (单位：秒)
    value: {
      type: [Number, String],
      default: 0,
    },
    // 是否自动开始计时
    start: {
      type: Boolean,
      default: true,
    },
  },
  data() {
    return {
      h: "00", // 时
      s: "00", // 分
      m: "00", // 秒
      timer: null, // 定时器
    };
  },
};
</script>

<style scoped>
.vk-countdown {
  display: flex;
}
</style>
